import React from 'react';
import { connect } from 'dva/index';
import { Button, Col, Form, Input, Popconfirm, Row, Table, Select } from 'antd';
import Constants from '../../utils/Constants';
import RightConstants from '../../utils/RightConstants';
import RightBox from '../../components/common/rightBox';
import ChargeTemplateDetail from '../../components/quotationSupport/chargeTemplate/chargeTemplateDetail';


const R = require('ramda');
const FormItem = Form.Item;

const chargeTemplate = Form.create()(class ChargeTemplate extends React.Component {
	constructor(props) {
		super(props);
	}

	componentDidMount() {
		this.props.dispatch({ type: 'chargeTemplate/query', payload: { ...R.pick(['page', 'size'], Constants.DEFAULT_PAGE) } });
	}

	handleOpen = (id, disabled,newAdd) => {
                this.props.dispatch({
                    type: 'chargeTemplate/get',
                    payload: { id }
                })

		this.chargeTemplateDetail.handleOpen(id,disabled,newAdd);
	}

	handleDelete = id => {
		this.props.dispatch({
			type: 'chargeTemplate/remove',
			payload: {
				id,
				onSuccess: this.handleSearch
			}
		})
	}

	handleSearch = flag => {
		let newPage = this.props.chargeTemplate.page;
		if (flag) newPage.page = 1;
		this.props.dispatch({
			type: 'chargeTemplate/query',
			payload: {
				...this.props.form.getFieldsValue(),
				...R.pick(['page', 'size'], newPage)
                // page: newPage

			}
		});
	};


	columns = [
		{ title: '模板名称', dataIndex: 'name', key: 'name' },
		{ title: '类型', dataIndex: 'type', key: 'type',
			render: (record) => {
			if (record == '0'){
                return '应付'
			}else if(record == '1'){
                return '应收'
			}else if(record == '2'){
                return '为什么有2'
            }
			else return '未知'

			},
		},
		{ title: '创建人', dataIndex: 'creatorName', key: 'creatorName' },
		{ title: '创建时间', dataIndex: 'createTime', key: 'createTime' },
		{
			title: '操作',
			render: (record) => {
                let editLink = <RightBox resource={RightConstants.QUOTATIONSUPPORT.QUOTATIONSUPPORT_FEEITEMTEMPLATE_EDIT} split={true}><a href="#" onClick={this.handleOpen.bind(this, record.id, false,false)}>编辑</a></RightBox>
                let deleteLink = <RightBox resource={RightConstants.QUOTATIONSUPPORT.QUOTATIONSUPPORT_FEEITEMTEMPLATE_EDIT} ><a href="#" onClick={this.handleDelete.bind(this, record.id)}>删除</a></RightBox>
				deleteLink = <RightBox resource={RightConstants.QUOTATIONSUPPORT.QUOTATIONSUPPORT_FEEITEMTEMPLATE_DELETE} >{deleteLink}</RightBox>
				return <span>{editLink}{deleteLink}</span>
			}
		}
	];

	render() {
        let dataSource = R.isNil(this.props.chargeTemplate.dataSource) ? {} : this.props.chargeTemplate.dataSource;
        let formItemLayout = { labelCol: { span: 8 }, wrapperCol: { span: 16 } };
		const { getFieldDecorator } = this.props.form;
		let pagination = {
			showTotal: total => `共 ${total} 条数据`,
			current: this.props.chargeTemplate.page.page,
			pageSize: this.props.chargeTemplate.page.size,
			total: this.props.chargeTemplate.page.totalRow,
			showSizeChanger: true,
			onShowSizeChange: (current, size) => {
				let newPage = this.props.chargeTemplate.page;
				newPage.size = size;
				newPage.page = 1;
				this.props.dispatch({
					type: 'chargeTemplate/query',
					payload: {
                        // chargeTemplate : values.chargeTemplate,
						...this.props.form.getFieldsValue(),
						...R.pick(['page', 'size'], newPage)
					}
				});
			},
			onChange: (pageNumber, pageSize) => {
				let newPage = this.props.chargeTemplate.page;
				newPage.page = pageNumber;
				this.props.dispatch({
					type: 'chargeTemplate/query',
					payload: {
						...this.props.form.getFieldsValue(),
						...R.pick(['page', 'size'], newPage)
					}
				});
			}
		}

		return (
			<div>
				<Row>
					<Col span={8}><FormItem {...formItemLayout} label={'模板名称'}>{getFieldDecorator('name')(<Input maxLength="200" placeholder="请输入模板名称" />)}</FormItem></Col>
					<Col span={8}><FormItem {...formItemLayout} label={'费用类型'}>{getFieldDecorator('type')(
						<Select style={{ width: 120 }} allowClear>
							<Select.Option value="0">应付</Select.Option>
							<Select.Option value="1">应收</Select.Option>
						</Select>
					)}</FormItem></Col>
					<Col span={7} style={{ marginLeft: 42 }}>
						<Button type="primary" icon="search" style={{ marginRight: 5 }} onClick={this.handleSearch.bind(this, true)}>查询</Button>
						<RightBox resource={RightConstants.QUOTATIONSUPPORT.QUOTATIONSUPPORT_FEEITEMTEMPLATE_ADD}>
							<Button type="primary" icon="plus" style={{ marginRight: 5 }} onClick={this.handleOpen.bind(this, null, false,true)}>新增模板</Button>
						</RightBox>
					</Col>
				</Row>

				<Table loading={this.props.loading} rowKey='id' dataSource={this.props.chargeTemplate.list} columns={this.columns} bordered={true} size={'middle'} pagination={pagination} />
				<ChargeTemplateDetail wrappedComponentRef={(inst) => this.chargeTemplateDetail = inst} refreshList={this.handleSearch} dataSource={dataSource} />
			</div>
		)
	}
})

function mapStateToProps(state) {
	return {
		loading: state.loading.models.chargeTemplate, chargeTemplate: state.chargeTemplate,localFeeDetail: state.localFeeDetail,orderCharge: state.orderCharge,
	};
}

export default connect(mapStateToProps)(chargeTemplate);